<!DOCTYPE html>
<html>
<head>
    <title>预算快照</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <meta name="description" content="木兰湾管理系统">
    <script type="text/javascript" src="../../static/include/header-css.js"></script>
</head>
<body>
<!--导航-->
<div class="weui-tab" style="height:44px;"   id="budgetTab">
    <div class="weui-tab-nav">
        <a href="javascript:budgetList();" class="weui-navbar__item weui-nav-green"> 预算列表 </a>
        <a href="javascript:budgetStat();" class="weui-navbar__item weui-nav-green"> 消费分析</a>
    </div>
    <input type="text" style="display:none;" name='budgetLogId' id="budgetLogId" />
</div>
<!--列表数据显示-->
<div id="dataContent"></div>
<div id="container"
     style="width: 100%; height: 70%; margin: 0 auto">
</div>
<div class="button_sp_area" align="center">
    <a href="javascript:scroll(0,0);" class="weui-btn weui-btn_mini weui-btn_primary">返回顶部</a>
</div>
<br>
<script type="text/javascript" src="../../static/include/footer-js.js"></script>
<!--顶部导航使用-->
<script type="text/javascript" src="../../static/js/iscroll-lite.min.js"></script>
<script type="text/javascript" src="../../static/js/echarts/echarts.min.js"></script>
<script type="text/javascript" src="../../static/js/echarts/mulanbaychart.js"></script>
<script>
    $(function() {
        $('#budgetTab').tab({defaultIndex:0,activeClass:"bg-green"});
        var budgetLogId = getQueryVariable('budgetLogId');
        $('#budgetLogId').val(budgetLogId);
        budgetList();
    });
    function budgetList() {
        var budgetLogId = $('#budgetLogId').val();
        var url='/budgetSnapshot/getData';
        var para={
            page:0,
            needTotal:false,
            budgetLogId:budgetLogId
        };
        doAjax(para,url,'GET',false,function(data){
            var bsList = data.rows;
            var html='';
            for (var i = 0; i < bsList.length; i++) {
                html+='<div class="weui-form-preview">';
                html+='    <a class="weui-cell  weui-cell_access weui-cell_example" href="#">\n';
                html+='        <div class="weui-cell__hd"><img src="../../static/image/budget.png"></div>\n';
                html+='        <div class="weui-cell__bd">\n';
                html+='<label class="weui-form-preview__label">'+bsList[i].name+'</label>';
                html+='        </div>\n';
                html+='        <div class="weui-cell__ft">预算金额'+formatMoneyWithSymbal(bsList[i].amount)+'</div>\n';
                html+='    </a>\n';
                html+='    <div class="weui-form-preview__bd">\n';
                html+='        <div class="weui-form-preview__item">\n';
                html+='            <label class="weui-form-preview__label">预算类型</label>\n';
                html+='            <span class="weui-form-preview__value mulanbay-dark-font">'+bsList[i].typeName+'</span>\n';
                html+='        </div>\n';
                html+='        <div class="weui-form-preview__item">\n';
                html+='            <label class="weui-form-preview__label">周期类型</label>\n';
                html+='            <span class="weui-form-preview__value mulanbay-dark-font">'+bsList[i].periodName+'</span>\n';
                html+='        </div>\n';
                html+='        <div class="weui-form-preview__item">\n';
                html+='            <label class="weui-form-preview__label">支付时间</label>\n';
                var cpt = bsList[i].cpPaidTime ==null ? '--':bsList[i].cpPaidTime;
                html+='            <span class="weui-form-preview__value mulanbay-dark-font">'+cpt+'</span>\n';
                html+='        </div>\n';
                html+='        <div class="weui-form-preview__item">\n';
                html+='            <label class="weui-form-preview__label">实际花费金额</label>\n';
                html+='            <span class="weui-form-preview__value mulanbay-dark-font">'+formatMoneyWithSymbal(bsList[i].cpPaidAmount)+'</span>\n';
                html+='        </div>\n';
                html+='</div>\n';
                html+='<br>\n';
            }
            //setElementInnerHTML('container','');
            setElementInnerHTML('dataContent',html);
        });
    }
    function budgetStat() {
        var budgetLogId = $('#budgetLogId').val();
        var url='/budgetSnapshot/stat';
        var para={
            page:0,
            needTotal:false,
            budgetLogId:budgetLogId
        };
        doAjax(para,url,'GET',false,function(data){
            setElementInnerHTML('dataContent','');
            createPieDataEnhanced(data,'container');
        });
    }
</script>
</body>
</html>